<%@ page pageEncoding="UTF-8"%>
<%@ include file="../common/global.jsp"%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="../common/meta.jsp"%>
<title><f:message key="common.title" /> - <f:message key="user" /></title>
<%@ include file="../common/css.jsp"%>
</head>
<body>
<div id="wrapper">
<%@ include file="../common/topbar.jsp"%>
<%@ include file="../common/header.jsp"%>

    <div id="masthead">

        <div class="container">

            <div class="masthead-pad">

                <div class="masthead-text">
                    <h5><f:message key="user.create_user" /></h5>
                </div> <!-- /.masthead-text -->

            </div>

        </div> <!-- /.container -->

    </div> <!-- /#masthead -->

    <div id="content">

        <div class="container">


            <div class="row">

                <div class="span12">

					  <form class="form-horizontal" id="user_create_form" >
                            <fieldset>
                                <div class="control-group">
                                    <label class="control-label" for="username"><f:message key="user.username"/>:</label>
                                    <div class="controls">
                                        <input type="text" id="username" name="username"  class="input-large">
                                    </div>
                                </div>

                            <div class="form-group">
                                <label class="control-label" for="password"><f:message key="user.password"/>:</label>
                                <div class="controls">
                                    <input type="text" id="password" name="password" class="input-large ext-required">
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="control-label"><f:message key="user.role"/> </label>
                                <div class="controls">
                                    <tag:role roleList="${roleList}"/>
                                </div>
                            </div>

                            <div class="form-actions">
                                <button type="submit" class="btn btn-default">
                                    <f:message key="common.save" />
                                </button>
                                <button type="button" id="back" class="btn btn-default">
                                    <f:message key="common.back" />
                                </button>
                            </div>
                            </fieldset>
					</form>

            </div><!-- /.span12 -->

    </div> <!-- /.row -->

</div> <!-- /.container -->

</div> <!-- /#content -->

</div> <!-- /#wrapper -->

<%@ include file="../common/footer.jsp"%>
<%@ include file="../common/js.jsp"%>
	<script type="text/javascript">
        $(function() {
            $('#user_create_form').ajaxForm({
                type: 'post',
                url: BASE + '/user',
                dataType: 'json',
                beforeSubmit: function() {
                    return Smart.Validator.checkRequired('user_create_form');
                },
                success: function(result) {
                    if (result.success) {
                        location.href = BASE + '/users';
                    }
                }
            });

            $('#back').click(function() {
                history.back();
            });
        });
	</script>
</body>
</html>